﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv=“charset” content=“utf-8”>
    <link rel="stylesheet" href="StaticWeb3.css">
    <title>简书8</title>
</head>
<body>
    <div class="head">
        <div class="headleft">
            <div class="jianshu">简书</div>
            <div class="zhinan">
                <img src="指南.png" alt="加载图片" class="photoOfhead">
                <span>首页</span>
            </div>
            <div class="shouji">
                <img src="手机.png" alt="加载图片" class="photoOfhead">
                <span>下载</span>
            </div>
            <div class="input">
                <input type="text" placeholder="搜索">
                <img src="搜索.png" alt="加载图片" class="photoOfinput">
            </div>
        </div>
        <div class="headright">
            <div class="right">
                <span>Aa</span>
            </div>
            <div class="right">
                <span>登录</span>
            </div>
            <div class="zuche">
                <span>注册</span>
            </div>
            <div class="yumao">
                <img src="羽毛 (1).png" alt="加载图片" class="yumaoimg">
                <spans>写文章</span>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="slideshow">
            <div class="button">
                <img src="箭头左.png" alt="加载图片" class="photoOfslideshow">
            </div>
            <img src="轮播.png" alt="加载图片" class="bigphoto">
            <div class="button1">
                <img src="箭头.png" alt="加载图片" class="photoOfslideshow">
            </div>
        </div>
        <div class="hotrecommendation">
            <div class="contentleft">
                <div class="Hotcontent">
                    <div class="hotcontent">
                        <img src="img\man-hands-reading-boy-large.jpg" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">社会热点</div>
                    </div>
                    <div class="hotcontent">
                        <img src="img\VCG41678819337.jpg" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">成长励志</div>
                    </div>
                    <div class="hotcontent">
                        <img src="img\0__15815600_401_00.jpg" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">连载小说</div>
                    </div>
                    <div class="hotcontent1">
                        <img src="img\645317897236768460.png" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">娱乐八卦</div>
                    </div>
                    <div class="hotcontent">
                        <img src="img\简书日报-专题.png" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">简书日报 · 每日精选</div>
                    </div>
                    <div class="hotcontent">
                        <img src="img\IMG_3003.jpg" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">旅行 · 在路上</div>
                    </div>
                    <div class="hotcontent">
                        <img src="img\IMG_2226.jpg" alt="加载图片" class="photoOfhotrecommendation">
                        <div class="size">美食</div>
                    </div>
                    <div class="hotcontent3">
                        <div class="size">更多美食专题></div>
                    </div>
                </div>
                <div class="publish">
                    <div>
                        <img src="img\0dca220dd6bb.jpeg" alt="加载图片" class="photoOfpublish">
                        <div class="idsize">怀左同学 5小时前</div>
                    </div>
                    <div class="artile">
                        <h2>喜欢和爱的区别，究竟有多大？</h2>
                        <p>
                            01你有没有喜欢，或者真正地爱过一个人？原来爱和喜欢，终是有区别的。写文章的我，经常会捕捉一些微妙的感情，只有真正面对微妙时，我才深感语言的无能。我们常常不能直接用言…
                        </p>
                    </div>
                    <img src="img\2542851-bd6e41d81284a281.jpg" alt="加载图片" class="sweet">
                    <div class="endpage">
                        <div class="share">
                            <span class="sizeOfshare">我是大神我要分享！</span>
                        </div>
                        <div class="eye">
                            <img src="浏览.png" alt="加载图片" class="imgOftail">
                            <span class="eyeOfshare">10245</span>
                        </div>
                        <div class="note">
                            <img src="评论.png" alt="加载图片" class="imgOftail">
                            <span class="eyeOfshare">121</span>
                        </div>
                        <div class="coor">
                            <img src="位置.png" alt="加载图片" class="imgOftail">
                            <span class="eyeOfshare">n2</span>
                        </div>
                        <div class="money">
                            <img src="打赏.png" alt="加载图片" class="imgOftail">
                            <span class="eyeOfshare">3</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="contentright">
                <div class="purple">
                    <div class="word">
                        <span class="sizeOfColor">新上榜</span>
                        <img src="箭头 (1).png" alt="加载图片" class="photoOfdigest">
                    </div>
                </div>
                <div class="orange">
                    <div class="word">
                        <span class="sizeOfColor">7日热门</span>
                        <img src="箭头 (1).png" alt="加载图片" class="photoOfdigest">
                    </div>
                </div>
                <div class="red">
                    <div class="word">
                        <span class="sizeOfColor">30日热门</span>
                        <img src="箭头 (1).png" alt="加载图片" class="photoOfdigest">
                    </div>
                </div>
                <div class="green">
                    <div class="word">
                        <span class="sizeOfColor">简书版权中心</span>
                        <img src="箭头 (3).png" alt="加载图片" class="photoOfdigest">
                    </div>
                </div>
                <div class="blue">
                    <div class="word">
                        <span class="sizeOfColor">简书大学堂</span>
                        <img src="箭头 (4).png" alt="加载图片" class="photoOfdigest">
                    </div>
                </div>
                <div class="Download">
                    <div class="Two-Bar-Codes">
                        <img src="img\二维码.png" alt="加载图片" class="two-bar-codes">
                        <div class="download">
                            下载简书App
                            <img src="箭头.png" alt="加载图片" class="photoOfdigest1">
                            <div class="find">随时随地发现和创作内容</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>